<template>
    <div class="commentpb">
       <van-nav-bar
        title="全部回复"
        left-arrow
        @click-left="onClickLeft"
        />
        <CommentItem :commentcon="theCommentData" comitemtype="reply" />
        <van-divider class="fenge" />
        <!-- （'+com_count+'） -->
        <!-- 评论列表 -->
        <div class="ping" id="ping" >
            <Comment :source='theCommentData.com_id' replytype='comreply'  type="c" :list='comlist'/>
        </div>
        <!-- 评论弹窗 -->
        <comalert :popupshow="popupshow" :theCommentData="theCommentData" :message='message' type="reply" :comlist="comlist" :target="theCommentData.com_id" :artid="artid" @hidepub="hidepub">></comalert>
        <!-- 底部导航 -->
        <footernags type="c" @publishcom='publishcom' @showSharefun='showSharefun' :detaile='theCommentData' :artid="theCommentData.com_id"></footernags>
    </div>
</template>

<script>
import {getcomment} from '@/api/article';
import CommentItem from '@/components/CommentItem';
import Comment from '@/components/Comment';
import comalert from '@/components/comalert';
import footernags from '@/components/footernags';
export default {
    components: {CommentItem,CommentItem,comalert,footernags,Comment},
    props: {
        thecomment:{
            type:Object,
            required:true,
        },
        artid:{
            type:String,
            required:true,
        }
    },
    data() {
        return {
            theCommentData:'',
            replaynum:'',
            num:0,
            list:[],
            offset:null,
            loading: false,
            finished: false,
            com_count:0,
            popupshow:false,
            comlist:[],
            message:'',
        };
    },
    watch: {
        thecomment:{
            deep:true, //开启深度监听
            handler(data){
                this.theCommentData=data
                this.onLoad()
            }
        }
    },
    computed: {},
    methods: {
        // 隐藏评论弹窗
        hidepub(){
            this.popupshow=false
        },
        //弹出评论弹窗
        publishcom(){
            this.popupshow=true
            this.message=''
        },
        
        onClickLeft(){
            this.$router.go(-1)
        },
        showSharefun(){
            this.message=''
            this.showShare=true;
        },
        async onLoad() {
            try{
                this.comlist=[];
                const {data}=await getcomment({type:'c',source:this.theCommentData.com_id,limit:'10',offset:this.offset||''})
                this.comlist.push(...data.data.results)
                this.com_count=data.data.total_count
                this.loading=false;
                if(data.data.results.length<10){
                    this.finished=true;
                }else{
                    this.offset=data.data.results[9].com_id
                }
            }
            catch(err){
                this.$toast('获取评论失败')
                console.log(err)
            }
        },
    },
    created() {
        this.$bus.$on('point_com_reply',(data)=>{ 
            this.message='@'+data.aut_name+'：'
            this.popupshow=true
        })
        this.theCommentData=this.thecomment
        console.log(this.theCommentData)
        
    },
    mounted() {
        
    }
};
</script>
<style lang="less" scoped>
.commentpb{
    padding-bottom: 1.2rem;
}
.fenge{
    margin:0
}
</style>